<template>
  <PageWrapper
    dense
    contentFullHeight
    fixedHeight
    contentClass="flex"
    title="清除数据"
    :loading="loading"
    :loading-tip="t('common.loadingText')"
  >
    <div class="h-full w-full bg-white">
      <div class="mx-auto w-1/3 pt-3">
        <ScrollContainer class="pr-4">
          <BasicForm @register="registerForm" />
        </ScrollContainer>
      </div>
    </div>
  </PageWrapper>
</template>
<script lang="ts">
  import { PageWrapper } from '/@/components/Page';
  import { defineComponent, ref, unref, onMounted } from 'vue';
  import { BasicForm, useForm } from '/@/components/Form/index';
  import { formSchema } from './reclaim.data';
  import { ScrollContainer } from '/@/components/Container';
  import { useI18n } from '/@/hooks/web/useI18n';
  import { useMessage } from '/@/hooks/web/useMessage';
  import { getAdminReclaim } from '/@/api/system/system';
  import { isArray } from '/@/utils/is';

  export default defineComponent({
    components: { BasicForm, ScrollContainer, PageWrapper },
    setup() {
      const loading = ref(false);
      const { createMessage } = useMessage();
      const { t } = useI18n();

      const [registerForm, { resetFields, validate }] = useForm({
        labelWidth: 75,
        schemas: formSchema,
        showActionButtonGroup: true,
        actionColOptions: {
          span: 23,
        },
        submitButtonOptions: {
          text: '确定',
        },
        submitFunc: customSubmitFunc,
      });
      let dataRef = ref<Recordable>({});
      const initForm = async () => {
        resetFields();
      };

      async function customSubmitFunc() {
        try {
          const values = await validate();
          loading.value = true;
          const formData = Object.assign({}, unref(dataRef), values);
          if (isArray(formData.module)) {
            formData.module = formData.module.join(',');
          }
          console.log('formData', formData);
          await getAdminReclaim(formData);
          createMessage.success('操作成功');
          initForm();
        } finally {
          loading.value = false;
        }
      }

      onMounted(() => {
        initForm();
      });

      return { registerForm, loading, t };
    },
  });
</script>
